﻿<UserControl x:Class="ReportingManagement.Components.MultiSelectComboBox"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="50" d:DesignWidth="450">
    <ComboBox x:Name="MultiSelectCombo" SnapsToDevicePixels="True" OverridesDefaultStyle="True"
              ScrollViewer.HorizontalScrollBarVisibility="Auto" ScrollViewer.VerticalScrollBarVisibility="Auto"
              ScrollViewer.CanContentScroll="True" IsSynchronizedWithCurrentItem="True">
        <ComboBox.ItemTemplate>
            <DataTemplate>
                <CheckBox Content="{Binding Title}" IsChecked="{Binding Path=IsSelected,Mode=TwoWay}"
                          Tag="{RelativeSource FindAncestor, AncestorType={x:Type ComboBox}}"
                          Click="CheckBox_Click"/>
            </DataTemplate>
        </ComboBox.ItemTemplate>
        <ComboBox.Template>
            <ControlTemplate TargetType="ComboBox">
                <Grid>
                    <ToggleButton x:Name="ToggleButton" Grid.Column="2" Focusable="False"
                                  IsChecked="{Binding Path=IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"
                                  ClickMode="Press" HorizontalContentAlignment="Left">
                        <ToggleButton.Template>
                            <ControlTemplate>
                                <Grid>
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="*" />
                                        <ColumnDefinition Width="18" />
                                    </Grid.ColumnDefinitions>
                                    <Border x:Name="Border" Grid.ColumnSpan="2" CornerRadius="2"
                                            Background="White" BorderBrush="Black" BorderThickness="1" />
                                    <Border x:Name="BorderComp" Grid.Column="0" CornerRadius="2"
                                            Margin="1" Background="White" BorderBrush="Black"
                                            BorderThickness="0,0,0,0">
                                        <TextBlock Text="{Binding Path=Text, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=UserControl}}"
                                                   Background="White" Padding="3" />
                                    </Border>
                                    <Path x:Name="Arrow" Grid.Column="1" Fill="Black"
                                          HorizontalAlignment="Center" VerticalAlignment="Center"
                                          Data="M 0 0 L 4 4 L 8 0 Z" />
                                </Grid>
                            </ControlTemplate>
                        </ToggleButton.Template>
                    </ToggleButton>
                    <Popup x:Name="Popup" Placement="Bottom" AllowsTransparency="True"
                           Focusable="False" IsOpen="{TemplateBinding IsDropDownOpen}" 
                           PopupAnimation="Slide" 
                           MinWidth="{TemplateBinding ActualWidth}"
                           MaxHeight="{TemplateBinding MaxDropDownHeight}">
                        <Grid x:Name="DropDown" SnapsToDevicePixels="True">
                            <Border x:Name="DropDownBorder" BorderThickness="1"
                                    Background="White" BorderBrush="Black" />
                            <ScrollViewer Margin="4,6,4,6" SnapsToDevicePixels="True" DataContext="{Binding}">
                                <StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained" />
                            </ScrollViewer>
                        </Grid>
                    </Popup>
                </Grid>

                <ControlTemplate.Triggers>
                    <Trigger Property="HasItems" Value="false">
                        <Setter TargetName="DropDownBorder" Property="MinHeight" Value="95" />
                    </Trigger>
                    <Trigger SourceName="Popup" Property="Popup.AllowsTransparency" Value="True">
                        <Setter TargetName="DropDownBorder" Property="CornerRadius" Value="4" />
                        <Setter TargetName="DropDownBorder" Property="Margin" Value="0,2,0,0" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </ComboBox.Template>
    </ComboBox>
</UserControl>
